<template>
  <div v-if="async">
    <el-tree :props="props" :data="loadNode" node-key="id" :default-checked-keys="viewModel" :current-node-key="viewModel" show-checkbox @check-change="handleCheckChange" />
  </div>
</template>

<script>
export default {
  model: {
    prop: 'dataModel',
    event: 'change'
  },
  props: {
    widget: {},
    dataModel: {},
    size: {}
  },
  data() {
    return {
      async: false,
      viewModel: [2],
      props: {
        label: 'name',
        children: 'childrens',
      },
      loadNode: [
        {
          name: '111111111',
          id: 1
        },
        {
          name: '22222222222',
          id: 2
        }
      ]
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    async init() {   
      if (this.dataModel) {
        this.viewModel = this.dataModel        
      }
      this.async = true
    },
    handleCheckChange(e) {
      
    }
  }
}
</script>

<style>

</style>